import React from 'react';
import { Routes, Route } from 'react-router-dom';
import { ThemeProvider } from '@mui/material';
import CssBaseline from '@mui/material/CssBaseline';
import Navbar from './components/Navbar';
import Home from './pages/Home';
import Dashboard from './pages/Dashboard';
import Reports from './pages/Reports';
import About from './pages/About';
import Calculator from './pages/Calculator';
import Challenges from './pages/Challenges';
import Community from './pages/Community';
import ActionPlan from './pages/ActionPlan';
import AdminLogin from './pages/AdminLogin';
import Profile from './pages/Profile';
import { ChallengeProvider } from './contexts/ChallengeContext';
import { AuthProvider } from './contexts/AuthContext';
import theme from './theme';
import { ActivityProvider } from './contexts/ActivityContext';
import { ResourceProvider } from './contexts/ResourceContext';

function App() {
  return (
    <ThemeProvider theme={theme}>
      <AuthProvider>
        <ResourceProvider>
          <ActivityProvider>
            <ChallengeProvider>
              <CssBaseline />
              <Navbar />
              <Routes>
                <Route path="/" element={<Home />} />
                <Route path="/dashboard" element={<Dashboard />} />
                <Route path="/reports" element={<Reports />} />
                <Route path="/about" element={<About />} />
                <Route path="/calculator" element={<Calculator />} />
                <Route path="/challenges" element={<Challenges />} />
                <Route path="/community" element={<Community />} />
                <Route path="/plan" element={<ActionPlan />} />
                <Route path="/admin/login" element={<AdminLogin />} />
                <Route path="/profile" element={<Profile />} />
              </Routes>
            </ChallengeProvider>
          </ActivityProvider>
        </ResourceProvider>
      </AuthProvider>
    </ThemeProvider>
  );
}

export default App; 